.footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 200px;
    background:rgba(238,237,238,1);
    .footer-container {
        margin: 0 auto;
        width: 1192px;
        font-size: 0;
        position: relative;
        .remark , .telephone , .shortcut {
            display: inline-block;
            vertical-align: top;
            .top {
                
                height: 28px;
                margin-top: 56px;
                font-size:18px;
                font-family:PingFangSC-Semibold;
                font-weight:600;
                color:rgba(51,51,61,1);
                line-height: 1;
                img {
                    vertical-align: top;
                    height: 28px;
                }
            }
            .bottom {
                margin-top: 15px;
                font-size: 0;
                > div {
                    display: inline-block;
                    margin-right: 20px;
                    font-size:14px;
                    font-family:PingFangSC-Regular;
                    font-weight:400;
                    color:rgba(104,104,113,1);
                    line-height: 1;
                    transition: color 0.3s;
                    &:hover {
                        color: rgba(223,65,49,1);
                    }
                    &:last-of-type {
                        margin-right: 0;
                    }
                }
            }
        }
        .remark {
            width: 605px;
            .top {
                img {
                    width: 90px;
                }
            }
        }
        .telephone {
            margin-left: 83px;
        }
        .shortcut {
            position: absolute;
            right: 0;
            .bottom {
                > div {
                    cursor: pointer;
                    position: relative;
                    .qrcode {
                        position: absolute;
                        bottom: 10px;
                        left: 50%;
                        margin-left: -52px;
                        width: 104px;
                        height: 112px;
                        display: none;
                        opacity: 0;
                        transform: translate(0,0);
                        transition: all 0.4s ease-in-out;
                        background: url('http://mobuz-live.oss-cn-hangzhou.aliyuncs.com/web/matter/image/bg_footer_baidi%402x.png') center center no-repeat;
                        background-size: cover;
                        img {
                            position: relative;
                            vertical-align: top;
                            display: block;
                            margin: 8px 0 0 8px;
                            width: 88px;
                            height: 88px;
                            opacity: 0.66;
                            z-index: 3;
                        }
                        // &.qrcode-active {
                        //     transform: translate(0,-10px);
                        //     opacity: 1;
                        //     img {
                        //         opacity: 1;
                        //     }
                        // }
                    }
                    .platform:hover {
                        & + .qrcode {
                            display: block;
                            transform: translate(0,-10px);
                            opacity: 1;
                            img {
                                opacity: 1;
                            }
                        }
                    }
                }
            }
        }
    }   
}